<script setup lang="ts">
import { ref } from 'vue';
import ChildComp from './components/ChildComp.vue'

// 1. 提供数据
const money = ref(100)
const changeMoney = (value: number) => {
  money.value += value
}

const car = ref('黄包车')
const changeCar = (value: string) => {
  console.log(value)
  car.value = value
  money.value -= 660000
}

const house = ref('乡村大別野')
const changeHouse = (value: string) => {
  house.value = value
  money.value -= 6660000
}
</script>

<template>
  <div class="father">
    父组件-爸爸的钱包: {{ money }}
    父组件-爸爸的车: {{ car }}
    <!-- 注册自定义事件 -->
    <!-- <ChildComp :money="money" :car="car" :house="house" @changeMoney="changeMoney" @changeCar="changeCar"
      @changeHouse="changeHouse" /> -->

    <ChildComp :money="money" @changeMoney="changeMoney" @changeCar="changeCar" @changeHouse="changeHouse" />

  </div>
</template>

<style scoped>
.father {
  width: 800px;
  height: 500px;
  border: 10px solid #000;
}
</style>
